<template>
	<view class="root">
		<text>官方功能</text>
		<!-- 功能 -->
		<view class="frieds">

			<view class="icon iconfont icon-shouye add"></view>
			<view style="display: flex;justify-content: space-between;width: 84%;">
				<text>
					<text class="users ">官方</text>
				</text>
			</view>
		</view>
		<view class="frieds" @click="qiangbao">
			<view class="icon iconfont icon-jiedan add"  style="background-color: #3DB271;"></view>
			<view class="addtext">
				<text>
					<text class="users ">钱包</text>
				</text>
			</view>
		</view>
		
		<view class="frieds" @click="shao">
			<view class="icon iconfont icon-xiangji add " style="background-color: #acb0ff;"></view>
			<view  class="addtext">
				<text>
					<text class="users ">新朋友</text>
				</text>
			</view>
		</view>
		

		<!-- 企业 -->
		<view class="frieds">

			<image src="../../static/prites/msg.jpg" mode="scaleToFill"></image>
			<view style="display: flex;justify-content: space-between;width: 84%;">
				<text>
					<text class="users">广州群(暂无效)\n</text>
				</text>
			</view>
		</view>
		<!-- 先留着 -->
		<!-- <view class="frieds">

			<image src="../../static/prites/msg.jpg" mode="scaleToFill"></image>
			<view style="display: flex;justify-content: space-between;width: 84%;">
				<text>
					<text class="users">东莞漫展(惠东区)\n</text>
				</text>
			</view>
		</view> -->
		<text>个人朋友</text>
		<!-- 列表 -->
		<view v-for="(item,index) in needUser" :key="index" sty>
			<list :user="item"></list>
		</view>
		<!-- 右上角 -->
	</view>
</template>

<script>
	import a from '../../js/request.js';
	// 引入组件wx
	import list from '../../components/listfriend.vue'
	var b = new a
	export default {
		data() {
			return {
				// 接受服务器
				needUser: [{
						src: 'http://ani-qi.gitee.io/resources/1.jpg',
						name: '琼雨',
					},
					{
						src: 'http://ani-qi.gitee.io/resources/2.jpg',
						name: '彩琪',
					},
					{
						src: 'http://ani-qi.gitee.io/resources/3.jpg',
						name: 'Tong',
					},
					{
						src: 'http://ani-qi.gitee.io/resources/4.jpg',
						name: '小明'
					},
					{
						src: 'http://ani-qi.gitee.io/resources/5.jpg',
						name: 'Ani-cc',
					},
					{
						src: 'http://ani-qi.gitee.io/resources/6.jpg',
						name: '小学同学'
					},
					{
						src: 'http://ani-qi.gitee.io/resources/7.jpg',
						name: '篮球大佬'
					},
					{
						src: 'http://ani-qi.gitee.io/resources/8.jpg',
						name: 'Cheny'
					}
				]
			};
		},
		methods: {
			// 摄像头
			shao() {
				uni.scanCode({
					success: (res) => {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);

						uni.setClipboardData({
							data: res.result,
						});
						setTimeout(() => {
							this.cptext = res.result
							this.cpshow = true
							console.log(this.show)

						}, 1000)

					}
				});
			},
			qiangbao()
			{
				console.warn(54646)
				uni.navigateTo({
					url:"../../pageA/webview/webview"
				})
			},
			// 右上角的事件
			onNavigationBarButtonTap(val) {
				if (val.index == 1) {
					this.shao()
				}
			}
		},
		// 注册
		components: {
			list
		}
	}
</script>

<style lang="less">
	.root {
		width: 96%;
		margin: 0 auto;

		//官群/添加
		.add {
			display: flex;
			color: #ffffff;
			border-radius: 22rpx;
			height: 85rpx;
			background-color: #1c77ff;
			width: 85rpx;
			justify-content: center;
			font-size: 50rpx;
			align-items: center;
		}
	}
	.addtext {
				display: flex;
				justify-content: space-between;
				width: 84%;
			}
	// 企业
	.frieds {
		width: 96%;
		// margin: 2%;
		margin: 0 auto;
		height: 100rpx;
		line-height: 150rpx;
		// background-color: red;
		border-bottom: 1px solid #D9D9D9;
		// padding-bottom: 8px;
		display: flex;
		align-items: center;
		justify-content: space-between;

		image {
			width: 80rpx;
			height: 80rpx;
			border-radius: 20rpx;
		}

		view {
			.users {
				font-size: 34rpx;
				font-weight: bolder;
			}

			.time {
				font-size: 24rpx;
				color: #b0b0b0;
			}

			.crx {
				font-size: 25rpx;
				color: #b0b0b0;
			}
		}

	}

	.xin {
		z-index: 199;
		width: 0;
		height: 0;
		border: 20rpx solid;
		border-color: transparent transparent #333333 transparent;
		position: fixed;
		right: 2%;
		// opacity: .8;
		top: -20rpx;
	}

	.bt {
		z-index: 99;
		position: fixed;
		right: 1.8%;
		top: 18rpx;
		background-color: #333333;
		color: #EBECEB;
		width: 35%;
		font-size: 38rpx;
		border-radius: 10rpx;

		text {
			margin-left: 4%;
			letter-spacing: 13rpx;
		}
	}
</style>
